<template>
  <div>
    <div class="newsinfo">
      <h3 class="title">{{newsInfo.title}}</h3>
      <p>
        <span>发表时间:{{newsInfo.add_time}}</span>
        <span>点击次数:{{newsInfo.click}}次</span>
      </p>
      <hr>
      <div class="content" v-html="newsInfo.content"></div>
      <comment-box :id="this.id"></comment-box>
    </div>
  </div>
</template>
<script>
import axios from 'axios'
import comment from '../subcomponents/comment.vue'
export default {
  data(){
    return {
      id:this.$route.params.id,
      newsInfo:{}
    }
  },
  created(){
    this.getNewsInfo()
  },
  methods:{
    getNewsInfo(){
      axios.get('/api/getnew/'+this.id).then(res=>{
        this.newsInfo=res.data.message[0]
      })
    }
  },
  components:{
    "comment-box":comment
  }
  
}
</script>

<style lang="less">
.newsinfo{
  padding: 0 5px;
  .title{
    margin: 15px 0;
    font-size: 16px;
    text-align: center;
    color:#ff8522
  }
  p{
    font-size: 13px;
    color:#226aff;
    display: flex;
    justify-content: space-between;
  }
  .content{
    color: #666;
    img{
      width: 100%;
    }
  }
}

</style>